import { message, Spin } from 'antd';
import React from 'react';
import { inject, observer } from 'mobx-react';
import SettingDialog from '../../public/SettingDialog';
import { routerShape, locationShape } from 'react-router';
import { WeaLocaleProvider, WeaSearchGroup } from 'ecCom';

const getLabel = WeaLocaleProvider.getLabel;

@inject('emailInboxStore')
@observer
class TipsOfAutoReceiveEmails extends React.Component {
  static contextTypes = {
    router: routerShape,
    location: locationShape,
  };

  constructor() {
    super();
    this.succBlockExecTime = 0; // 表示下面success的if块中代码执行次数
    this.failBlockExecTime = 0; // 表示下面fail的if块中代码执行次数
  }

  componentDidMount() {
    // this.resetCounter();
    // window.addEventListener("hashchange", this.resetCounter, false);
  }

  // 当重新进入收件箱页面时，重置计数器，
  resetCounter = () => {
    const { location: { pathname } } = this.props;
    const _path = pathname.replace('main/email/', '').split('/')[0];
    if (_path === 'inbox') {
      this.succBlockExecTime = 0; // 表示下面success的if块中代码执行次数
      this.failBlockExecTime = 0; // 表示下面fail的if块中代码执行次数
    }
  };

  componentWillUnmount() {
    // window.removeEventListener("hashchange", this.resetCounter, false);
  }

  render() {
    const { emailInboxStore } = this.props;
    const { loadEmailsStat, accountList, receivedMailNumber, setState, visOfRecMailsErrDeatilDia, receiveEmailsRes } = emailInboxStore;
    if (loadEmailsStat === 'loading') {
      if (accountList.length >= 1) {
        return (<div style={{ position: 'fixed', left: '45%', top: 80 }}>
          <Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@rzw15g`} />
          <span style={{ display: 'inline-block', fontSize: 12, color: '#333333', lineHeight: '18px', marginLeft: 15 }}>
            {
              accountList.length === 1
                ? `${getLabel(385603, '正在收取')}${accountList[0].accountName}${getLabel(71, '邮件')}`
                : `${getLabel(385604, '正在收取邮件')}`
            }
          </span>
        </div>);
      }
        return null;
    } else if (loadEmailsStat === 'success') {
      setState({ loadEmailsStat: 'finally' }); // 确保这段代码在每次开始自动接收后且成功时都只会执行一次
      return (
        <React.Fragment ecId={`${this && this.props && this.props.ecId || ''}_undefined@p75fml`}>
          {
            receivedMailNumber > 0 ? message.success(`${getLabel(385605, '成功接收')} (${receivedMailNumber}) ${getLabel(385606, '封邮件！')}`) : message.success(getLabel(384231, '无新邮件'))
          }
        </React.Fragment>
      );
    } else if (loadEmailsStat === 'fail') {
      let alllErrMsgs = receiveEmailsRes.filter(elem => elem.status !== '1');
      let lastErrMsgs = alllErrMsgs[alllErrMsgs.length - 1];
      this.failBlockExecTime++;
      if (this.failBlockExecTime == 1) {
        // 确保这段代码在每次开始自动接收后且失败时都只会执行一次
        return (
          <React.Fragment ecId={`${this && this.props && this.props.ecId || ''}_undefined@e8b3yi`}>
            {
              message.error(
                <React.Fragment ecId={`${this && this.props && this.props.ecId || ''}_undefined@ts741h`}>
                  {`${getLabel(385607, '邮件接收失败！')}`}
                  <a
                    href="javascript:;"
                    onClick={() => {
                      setState({ visOfRecMailsErrDeatilDia: true });
                    }}
                  >
                    {getLabel(83110, '查看详情')}
                  </a>
                </React.Fragment>,
                100000000000000000000000000000000000,
              )
            }
            <SettingDialog ecId={`${this && this.props && this.props.ecId || ''}_SettingDialog@003hhe`}
              title={getLabel(22045, '详情')}
              visible={visOfRecMailsErrDeatilDia}
              onCancel={() => {
                setState({ visOfRecMailsErrDeatilDia: false });
              }}
            >
              <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@u0yjj4`} title={getLabel(25700, '错误信息')}>
                {lastErrMsgs.result.msg.solution}
              </WeaSearchGroup>
              <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@s1rrw8`} title={getLabel(82875, '错误日志')}>
                {lastErrMsgs.result.msg.errorString}
              </WeaSearchGroup>
            </SettingDialog>
          </React.Fragment>
        );
      }
        return null;
    }
      return null;
  }
}

export default TipsOfAutoReceiveEmails;
